luci-theme-*: wrap span tags, fixes badge text

The nowrap can be a bit obnoxious when available layout space is
limited. Wrap.

Signed-off-by: Paul Donald <[email protected]>

diff --git a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
index 57903c75c3e006e61d09920aa3608273c8aea0e3..67c23fe43d33ad69ab2f76a48e63b50882cd7607 100644 (file)
--- a/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
+++ b/themes/luci-theme-bootstrap/htdocs/luci-static/bootstrap/cascade.css
@@ -318,7 +318,9 @@ a:hover {
        float: left;
 }
 
-.nowrap {
+.nowrap:not(span) {
+/*     Sometimes you need to wrap: badges on narrow screens look weird 
+       and nowrap defeats other width constraints, so exclude span */
        white-space: nowrap;
 }
 
@@ -2193,7 +2195,6 @@ th[data-sort-direction="desc"]::after { content: "\a0\25bc"; }
 .ifacebadge {
        display: inline-block;
        flex-direction: row;
-       white-space: nowrap;
        border: 1px solid var(--border-color-high);
        padding: 2px;
        background: linear-gradient(var(--background-color-high), var(--background-color-high) 25%, var(--background-color-medium));

diff --git a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
index bb9243f697ffd46f4eff90f69067eb0449755002..a7d39b6480c493764f8ce586ceca76017f466e5b 100644 (file)
--- a/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
+++ b/themes/luci-theme-material/htdocs/luci-static/material/cascade.css
@@ -369,7 +369,9 @@ small {
        float: left;
 }
 
-.nowrap:not(.td) {
+.nowrap:not(.td span) {
+/*     Sometimes you need to wrap: badges on narrow screens look weird 
+       and nowrap defeats other width constraints, so exclude span */
        white-space: nowrap;
 }
 

diff --git a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css
index 5d93b25e8f0058b92fcca8353c02407d78ecb111..9fa3ce6b2b495dd80aa6566b728587c1c1dfbf63 100644 (file)
--- a/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css
+++ b/themes/luci-theme-openwrt-2020/htdocs/luci-static/openwrt2020/cascade.css
@@ -552,7 +552,9 @@ tr.placeholder > td {
        vertical-align: middle !important;
 }
 
-.nowrap {
+.nowrap:not(span) {
+/*     Sometimes you need to wrap: badges on narrow screens look weird 
+       and nowrap defeats other width constraints, so exclude span */
        white-space: nowrap !important;
 }
 

diff --git a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
index 6381087a85f5095093403fbe6ce9bea5423853f8..b0e64753c20ac208242010756381407b2dfa224e 100644 (file)
--- a/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
+++ b/themes/luci-theme-openwrt/htdocs/luci-static/openwrt.org/cascade.css
@@ -64,7 +64,9 @@ body {
        line-height: 3em;
 }
 
-.nowrap {
+.nowrap:not(span) {
+/*     Sometimes you need to wrap: badges on narrow screens look weird 
+       and nowrap defeats other width constraints, so exclude span */
        white-space: nowrap;
 }